<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>动态路由的配置</title>
    <script type="text/javascript" src="../js/angular.min.js"></script>
    <script type="text/javascript" src="../js/angular-route.min.js"></script>

    <script>
        var myapp = angular.module('myapp',['ngRoute'])
        myapp .config(['$routeProvider',
            function($routeProvider) {
                $routeProvider.
                when('/javaee', {
                    templateUrl: '1.1.html'

                }).
                when('/node.js', {
                    templateUrl: '2.2.html'

                }).
                when('/php', {
                    templateUrl: '3.3.html'

                }).
                otherwise({
                    redirectTo: '/1.html'
                });
            }]);
    </script>


</head>
<body>
<div ng-app="myapp">
<div>
    <h1> head  </h1>
    <!--必须以#来声明动态路由的方式-->
<a href="#/javaee">JavaEE</a>
<a href="#/node.js">Node.js</a>
<a href="#/php">PHP</a>
</div>

<div ng-view>  </div>

<div>  <h1> foot  </h1> </div>


</div>
</body>
</html>